<%@ include file="/common.jsp"%>  
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
		<title>酱出名门人事工资管理平台</title>
	</head>

	<BODY>
		<div class="main">
			<%@include file="/head.jsp"%>
			<div class="nav">
				<ul>
					<li>
						<a href="roleAction.action">权限管理</a>
					</li>
					<li class="nav_pic"></li>

				</ul>
			</div>
			<div class="center">
				<div align="left"
					style="padding: 0; margin-left: 20px; margin-top: 10px">
					<a id="btn_role_add" href="roleAction!jumpToAdd.action">添加角色</a>
				</div>
				<div>
					<table id="role_table"
						style="width: 984px; padding: 0; margin: 10px 20px"
						cellspacing="0">
						<thead>
							<th scope="col">
								序号
							</th>
							<th scope="col">
								名称
							</th>
							<th scope="col">
								备注
							</th>
							<th scope="col">
								操作
							</th>
						</thead>
						<tbody>
						</tbody>
					</table>
					</div>
					<div style="float:left;margin-left:22px; width: 984px">  
							<div style='float: left; line-height: 28px;vertical-align: middle'>
							<span id="page_info"></span>
                             <a id="page_first" herf="#">首页</a> 
                             <a id="page_prev" herf="#">上一页</a> 
                             <a id="page_next" herf="#">下一页</a> 
                             <a id="page_last" herf="#">尾页</a>
                             <input id="page_num" type="text" class="text ui-widget-content ui-corner-all" style="height:24px;line-height:24px;width:20px;padding: 0px">
                             <a id="page_goto" herf="#">转</a> 
							</div>
					</div>		
			</div>

			<div class="clear"></div>
			<div class="footer">
				酱出名门人事工资管理平台 版权所有
			</div>
		</div>
		<div id="dialog" title="角色详细信息" style="display: none">
			<table border="0" cellpadding="0" cellspacing="0" width="100%" style="">
				<tr><td>角色名:</td><td></td></tr>
				<tr><td>权限:</td><td></td></tr>
				<tr><td>录入者:</td><td></td></tr>
				<tr><td>录入时间:</td><td></td></tr>
				<tr><td>备注:</td><td></td></tr>
			</table>
		</div>
	</body>
	<script type="text/javascript">
	$(function() {
		$('#dialog').dialog({
			autoOpen: false,
			width: 400
		});
		$("#btn_role_add").button();
        $("#page_first").button();
        $("#page_prev").button();
        $("#page_next").button();
        $("#page_last").button();
        $("#page_goto").button();
		findByPage(0);
	});


	function jumpToUpdateRole(roleId) {
		window.location.href="roleAction!jumpToUpdateRole.action?roleId=" + roleId;
	}

	function delRole(roleId, name) {
		
        var isdel = window.confirm("是否要删除" + name + "角色,单击确定继续,单击取消停止!");
        if (isdel) {
    		$.ajax( {
    			type : "POST",
    			url : "roleAction!deleteRole.action",
    			data : "roleId=" + roleId
    					+ "&timestamp=" + new Date().getTime(),
    			success : function(msg) {
    				delRoleCallback(msg);
    				
    			},
    			error : function(textStatus) {
    				alert("网络异常请稍后重试!");
    			}
    		});
        }

	}

    function delRoleCallback(msg) {
        switch (msg.status.code) {
        case "SUCCES" :
        	alert(msg.status.message);
        	window.location.reload(true);
            break;
        case "FAIL" :
        	alert(msg.status.message);
            break; 
        }
    }

	function queryRoleDetail(roleId) {

		$.ajax( {
			type : "POST",
			url : "roleAction!queryRoleDetail.action",
			data :  "roleId=" + roleId + "&timestamp=" + new Date().getTime(),
			success : function(msg) {
				queryRoleDetailCallback(msg);
			},
			error : function(textStatus) {
				alert("网络异常请稍后重试!");
			}
		});
		
    }

    function queryRoleDetailCallback(msg) {
        switch (msg.status.code) {
        case "SUCCES" :
        	showRoleDetail(msg.datas);
            break;
        default :
        	alert(msg.status.message);
            break; 
        }
    }

    function showRoleDetail(datas) {
    	 var permissions = "";
         for (var i = 0; i <  datas.permissions.length; i++) {
             if (i + 1 == datas.permissions.length) {
            	 permissions += datas.permissions[i].name;
             } else {
            	 permissions += datas.permissions[i].name + ",";
             }
         }
    
		 var array = [datas.role.name, permissions, datas.inputer, new Date(datas.role.inTime).toLocaleString(), datas.role.remark];
         $('#dialog').find('table > tbody > tr').each(function(i){
           $(this).find("td:last-child").text(array[i]);
         });

   	     $('#dialog').dialog('open');
   		 return false;
    }
    
	function findByPage(startIndex) {
		var pageObjRef = new pageObj();

		pageObjRef.startIndex = startIndex;

		$.ajax( {
			type : "POST",
			url : "roleAction!findByPage.action",
			data : "paginationJson=" + JSON.stringify(pageObjRef)
					+ "&timestamp=" + new Date().getTime(),
			success : function(msg) {
				findByPageCallback(msg);
			},
			error : function(textStatus) {
				alert("网络异常请稍后重试!");
			}
		});
	}


	
    function findByPageCallback(msg) {
        switch (msg.status.code) {
        case "SUCCES" :
        	showRoles(msg.datas);
            break;
        case "FAIL" :
        	alert(msg.status.message);
            break;
        case "EMPTY" :
        	alert(msg.status.message);
            break;    
        }
    }
	
	function showRoles(datas) {
		$("#role_table tbody tr").remove();
		var items = datas.items;

		for (var i = 0; i < items.length; i++) {
			var tr = $("<tr></tr>").attr("id", "tr_" + items[i].roleId);
		    tr.append($("<th scope='row' class='spec'></th>").html(i+1))
		      .append($("<td></td>").html(items[i].name))
		      .append($("<td></td>").html(items[i].remark + "&nbsp;"));
            var lastCol = $("<td></td>");
            var updateBtn = $("<a></a>");
            updateBtn.attr("href","#");
            updateBtn.html("修改");
            updateBtn.attr("onclick", "jumpToUpdateRole("+items[i].roleId+")");

            var delBtn = $("<a></a>");
            delBtn.attr("href","#");
            delBtn.html("删除");
            delBtn.attr("onclick", "delRole("+items[i].roleId+",'"+items[i].name+"')");
            
            lastCol.append(updateBtn);
            lastCol.append("&nbsp;|&nbsp;");
            lastCol.append(delBtn);
            tr.append(lastCol);
            tr.attr("ondblclick", "queryRoleDetail("+items[i].roleId+")");
			$("#role_table tbody").append(tr);
		}
		
		setPageBtnClick(datas);
		setPageInfo(datas);
	}

    function setPageInfo(datas) {
    	$("#page_info").empty();
        $("#page_info").html("共有&nbsp;" 
                + datas.totalCount + "&nbsp;条数据&nbsp;&nbsp;"
                + "每页&nbsp;" + datas.pageSize + "&nbsp;条&nbsp;当前&nbsp;"
                + (datas.currentPageIndex + 1) + "/" + datas.indexes.length + "页");
    	
    }
    function setPageBtnClick(datas) {
    	$("#page_first").unbind("click");
    	$("#page_prev").unbind("click");
    	$("#page_next").unbind("click");
    	$("#page_last").unbind("click");
    	$("#page_goto").unbind("click");
    	
        $("#page_first").click(function() {
        	findByPage(0);
         });
        
		$("#page_prev").click(function () {
			var startIndex = 0;
			if (datas.currentPageIndex >= 0) {
				if (datas.indexes.length > 0) {
					startIndex = datas.indexes[datas.currentPageIndex - 1];
				}
			}
			findByPage(startIndex);
		});

		$("#page_next").click(function () {
			var startIndex = 0;

			if (datas.indexes.length > 0) {
				if (datas.currentPageIndex + 1 >= datas.indexes.length) {
					startIndex = datas.indexes[datas.indexes.length - 1];
				} else {
					startIndex = datas.indexes[datas.currentPageIndex + 1];
				}
				
				
			}
			findByPage(startIndex);
		});

		$("#page_last").click(function () {
			var startIndex = 0;
			if (datas.indexes.length > 0) {
				startIndex = datas.indexes[datas.indexes.length - 1];
		    }

			findByPage(startIndex);
		});

		$("#page_goto").click(function (){
			var startIndex = 0;
			if ($("#page_num").val() == null || $("#page_num").val().length == 0) {
				alert("请填写要跳转的页面!");
				return;
		    }
			
			if (isNaN($("#page_num").val())) {
				alert("页面必须是数字!");
				return;
		    }

			if ($("#page_num").val() <= 0 ) {
				alert("该页面不存在!");
				return;
			}

			startIndex = datas.indexes[$("#page_num").val()  - 1];
			findByPage(startIndex);
			
		});
    }


    
	function pageObj() {
		this.pageSize = 5;
		this.startIndex = 0;
	}
</script>
</html>
